<div class="refund-info">
  <!--确认弹窗-->
  <p-confirmDialog acceptLabel="确认" rejectLabel="取消"></p-confirmDialog>
  <!--消息提示-->
  <p-messages  [closable]="true" [style]="{'position':'fixed','left': '10vw', 'top': '0','margin-top': '0','width': '100vw','z-index':'9999'}"></p-messages>
  <!--顶部按钮-->
  <div class="refund-info-header">
    <div class=" ui-g-12">
      <div class="ui-g-1 refund-info-header-btn refund-info-header-btn-add" (click)="infoAddClick()" [hidden]="btnHiden[0].hidden">
        <img class="refund-info-header-img-add" src="assets/images/ic_add.png" alt="">
        <span>新  增</span>
      </div>
      <div class="ui-g-1 refund-info-header-btn refund-info-header-btn-modify" (click)="infoModifyClick()" [hidden]="btnHiden[1].hidden">
        <img class="refund-info-header-img-modify" src="assets/images/ic_modify.png" alt="">
        <span>修 改</span>
      </div>
      <div class="ui-g-1 refund-info-header-btn refund-info-header-btn-delete" (click)="infoDeleteClick()" [hidden]="btnHiden[2].hidden">
        <img class="refund-info-header-img-delete" src="assets/images/ic_delete.png" alt="">
        <span>删 除</span>
      </div>
<!--      <div style="margin-top: 4.5vh;font-size: 0.875rem;margin-left: 1vw">-->
<!--        <label style="color: #fff;margin-left: 0.5vw" >小区：</label>-->
<!--        <p-dropdown [options]="SearchOption.village"  scrollHeight="100px" placeholder="请选择小区..." (onChange)="VillageChange($event)"></p-dropdown>-->
<!--        <label style="color: #fff;margin-left: 0.5vw">地块：</label>-->
<!--        <p-dropdown [options]="SearchOption.region" scrollHeight="100px" placeholder="请选择地块..." (onChange)="regionChange($event)"></p-dropdown>-->
<!--        <label style="color: #fff;margin-left: 0.5vw">楼栋：</label>-->
<!--        <p-dropdown [options]="SearchOption.building"  scrollHeight="100px" placeholder="请选择楼栋..." (onChange)="buildingChange($event)"></p-dropdown>-->
<!--        <label style="color: #fff;margin-left: 0.5vw">单元：</label>-->
<!--        <p-dropdown [options]="SearchOption.unit"   scrollHeight="100px" placeholder="请选择单元..." (onChange)="unitChange($event)"></p-dropdown>-->
<!--        <label style="color: #fff;margin-left: 0.5vw">房屋：</label>-->
<!--        <p-dropdown [options]="SearchOption.room"   scrollHeight="100px" placeholder="请选择房屋..." [(ngModel)]="searchRefundInfo.roomCode"></p-dropdown>-->
<!--      </div>-->
    </div>
    <!--//搜索-->
    <div class="ui-inputgroup refund-info-header-search" *ngIf="!btnHiden[3].hidden">
      <p-dropdown [options]="searchOption" placeholder="请选择搜索范围.."  scrollHeight="100px"  [(ngModel)]="searchType" [style]="{'width':'10vw','margin-right':'2vw'}"></p-dropdown>
      <input type="text" pInputText placeholder="请输入搜索内容"  [(ngModel)]="searchData">
      <button id="disabled-btn" class="refund-info-header-btn-search" type="button"  (click)="infoSearchClick()"  label="搜索">搜索</button>
    </div>
  </div>
  <!--表格-->
  <div class="refund-info-table">
    <rbi-check-table-btn [select]="infoSelect" (selectData)="selectData($event)" (detail)="infoDetailClick($event)" [option]="refundInfoOption"></rbi-check-table-btn>
  </div>
  <!--增加弹窗-->
  <p-dialog header="信息添加" [(visible)]="infoAddDialog" [width]="1100">
    <p-scrollPanel [style]="{width:'100%',height: '65vh'}" styleClass="custombar">
      <div class="ui-g ui-fluid" [ngStyle]="{'line-height':'4vh'}">
<!--      <div class="ui-g-6">-->
<!--        <div class="ui-g-4">-->
<!--          <label >小区：</label>-->
<!--        </div>-->
<!--        <div class="ui-g-8" style="line-height: 2vh">-->
<!--          <p-dropdown [options]="SearchOption.village" scrollHeight="100px" placeholder="请选择小区..."  (onChange)="VillageChange($event)" [(ngModel)]="infoAdd.villageCode"></p-dropdown>-->
<!--        </div>-->
<!--      </div>-->
<!--      <div class="ui-g-6">-->
<!--        <div class="ui-g-4">-->
<!--          <label>地块：</label>-->
<!--        </div>-->
<!--        <div class="ui-g-8" style="line-height: 2vh">-->
<!--          <p-dropdown [options]="SearchOption.region" scrollHeight="100px" placeholder="请选择地块..." (onChange)="regionChange($event)" [(ngModel)]="infoAdd.regionCode"></p-dropdown>-->
<!--        </div>-->
<!--      </div>-->
<!--      <div class="ui-g-6">-->
<!--        <div class="ui-g-4">-->
<!--          <label>楼栋：</label>-->
<!--        </div>-->
<!--        <div class="ui-g-8" style="line-height: 2vh">-->
<!--          <p-dropdown [options]="SearchOption.building" scrollHeight="100px" placeholder="请选择楼栋..." (onChange)="buildingChange($event)" [(ngModel)]="infoAdd.buildingCode"></p-dropdown>-->
<!--        </div>-->
<!--      </div>-->
<!--      <div class="ui-g-6">-->
<!--        <div class="ui-g-4">-->
<!--          <label>单元：</label>-->
<!--        </div>-->
<!--        <div class="ui-g-8" style="line-height: 2vh">-->
<!--          <p-dropdown [options]="SearchOption.unit" scrollHeight="100px" placeholder="请选择单元..." (onChange)="unitChange($event)" [(ngModel)]="infoAdd.unitCode"></p-dropdown>-->
<!--        </div>-->
<!--      </div>-->
<!--      <div class="ui-g-6">-->
<!--        <div class="ui-g-4">-->
<!--          <label>房间编号：</label>-->
<!--        </div>-->
<!--        <div class="ui-g-8" style="line-height: 2vh">-->
<!--          <p-dropdown [options]="roonCodeSelectOption" scrollHeight="100px" placeholder="请选择房间..." [(ngModel)]="infoAdd.roomCode"></p-dropdown>-->
<!--        </div>-->
<!--      </div>-->
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="addmobilePhone">客户电话：</label>
        </div>
        <div class="ui-g-8">
          <input id="addmobilePhone" type="text" pInputText placeholder="请输入客户电话.." [(ngModel)]="infoAdd.mobilePhone" (blur)="getUserInfo()">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="addmobilePhone">客户名称：</label>
        </div>
        <div class="ui-g-8">
          <input id="addmobileUser" disabled type="text" pInputText placeholder="请输入客户名称.." [(ngModel)]="infoAdd.surname">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label >收费项目：</label>
        </div>
        <div class="ui-g-8"  [ngStyle]="{'line-height':'2vh'}">
          <p-dropdown scrollHeight="100px"  [options]="ChargeSelectOption" placeholder="请选择收费项目.." (onChange)="chargeSelectChange($event)" [(ngModel)]="infoAdd.chargeCode"></p-dropdown>
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="chargeStandard">收费项目单价：</label>
        </div>
        <div class="ui-g-8">
          <input id="chargeStandard" disabled type="text" pInputText placeholder="请输入收费项目单价.." [(ngModel)]="infoAdd.chargeStandard">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="chargeUnit">收费项目单位：</label>
        </div>
        <div class="ui-g-8">
          <input id="chargeUnit" disabled type="text" pInputText placeholder="请输入收费项目单位.." [(ngModel)]="infoAdd.chargeUnit">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="chargeType">收费项目类型：</label>
        </div>
        <div class="ui-g-8">
          <input id="chargeType" disabled type="text" pInputText placeholder="请输入收费项目类型.." [(ngModel)]="ChargetTypeName">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="payerName">缴费人姓名：</label>
        </div>
        <div class="ui-g-8">
          <input id="payerName" type="text" pInputText placeholder="请输入缴费人姓名.." [(ngModel)]="infoAdd.payerName">
        </div>
      </div>

      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="payerPhone">缴费人手机号：</label>
        </div>
        <div class="ui-g-8">
          <input id="payerPhone" type="text" pInputText placeholder="请输入缴费人手机号.." [(ngModel)]="infoAdd.payerPhone">
        </div>
      </div>
<!--      <div class="ui-g-6">-->
<!--        <div class="ui-g-4">-->
<!--          <label >缴费方式：</label>-->
<!--        </div>-->
<!--        <div class="ui-g-8"  [ngStyle]="{'line-height':'2vh'}">-->
<!--          <p-dropdown scrollHeight="100px"  [options]="paymentMethodOption" placeholder="请选择支付方式"  [(ngModel)]="infoAdd.paymentMethod"></p-dropdown>-->
<!--        </div>-->
<!--      </div>-->
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label >开始日期：</label>
        </div>
        <div class="ui-g-8">
          <p-calendar [(ngModel)]="infoAdd.startTime" placeholder="请选择开始日期..." [monthNavigator]="true" [yearNavigator]="true" dateFormat="yy-mm-dd"  yearRange="1900:2100" [locale]="esDate"></p-calendar>
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label >结束日期：</label>
        </div>
        <div class="ui-g-8">
          <p-calendar [(ngModel)]="infoAdd.dueTime" placeholder="请选择结束日期..." [monthNavigator]="true" [yearNavigator]="true" dateFormat="yy-mm-dd"  yearRange="1900:2100" [locale]="esDate"></p-calendar>
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="personLiable">责任人：</label>
        </div>
        <div class="ui-g-8">
          <input id="personLiable" type="text" pInputText placeholder="请输入责任人.." [(ngModel)]="infoAdd.personLiable">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="personLiablePhone">责任人电话：</label>
        </div>
        <div class="ui-g-8">
          <input id="personLiablePhone" type="text" pInputText placeholder="请输入责任人电话.." [(ngModel)]="infoAdd.personLiablePhone">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="responsibleAgencies">负责机构：</label>
        </div>
        <div class="ui-g-8">
          <input id="responsibleAgencies" type="text" pInputText placeholder="请输入负责机构.." [(ngModel)]="infoAdd.responsibleAgencies">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="remarks">申请退款备注：</label>
        </div>
        <div class="ui-g-8">
          <textarea id="remarks" type="text" pInputText placeholder="请输入备注..." [(ngModel)]="infoAdd.remark"></textarea>
        </div>
      </div>
    </div>
    </p-scrollPanel>
    <p-footer>
      <div class="ui-dialog-buttonpane ui-helper-clearfix" style=" text-align: center">
        <button class="refund-info-dialog-Btn refund-info-dialog-Btn-sure" (click)="infoAddSureClick()">确认</button>
        <button class="refund-info-dialog-Btn refund-info-dialog-Btn-false"  (click)="infoAddDialog=false;clearData()">取消</button>
      </div>
    </p-footer>
  </p-dialog>
  <!--修改弹窗-->
  <p-dialog header="信息修改" [(visible)]="infoModifayDialog" [width]="900">
    <!--Content-->
    <p-scrollPanel [style]="{width:'100%',height: '75vh'}" styleClass="custombar">

      <div class="ui-g ui-fluid" [ngStyle]="{'line-height':'4vh'}">
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label >小区：</label>
        </div>
        <div class="ui-g-8" style="line-height: 2vh">
          <p-dropdown [options]="SearchOption.village" scrollHeight="100px" [placeholder]="infoModify.villageName"  (onChange)="VillageChange($event)" [(ngModel)]="infoModify.villageCode"></p-dropdown>
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label>地块：</label>
        </div>
        <div class="ui-g-8" style="line-height: 2vh">
          <p-dropdown [options]="SearchOption.region" scrollHeight="100px"  [placeholder]="infoModify.regionName" (onChange)="regionChange($event)" [(ngModel)]="infoModify.regionCode"></p-dropdown>
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label>楼栋：</label>
        </div>
        <div class="ui-g-8" style="line-height: 2vh">
          <p-dropdown [options]="SearchOption.building" scrollHeight="100px"  [placeholder]="infoModify.buildingName" (onChange)="buildingChange($event)" [(ngModel)]="infoModify.buildingCode"></p-dropdown>
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label>单元：</label>
        </div>
        <div class="ui-g-8" style="line-height: 2vh">
          <p-dropdown [options]="SearchOption.unit" scrollHeight="100px"  [placeholder]="infoModify.unitName" (onChange)="unitChange($event)" [(ngModel)]="infoModify.unitCode"></p-dropdown>
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label>房间编号：</label>
        </div>
        <div class="ui-g-8" style="line-height: 2vh">
          <p-dropdown [options]="roonCodeSelectOption" scrollHeight="100px"  [placeholder]="infoModify.roomCode" [(ngModel)]="infoModify.roomCode"></p-dropdown>
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="addmobilePhone">客户电话：</label>
        </div>
        <div class="ui-g-8">
          <input  type="text" pInputText  [placeholder]="infoModify.mobilePhone" [(ngModel)]="infoModify.mobilePhone" (blur)="getUserInfo()">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="addmobilePhone">客户名称：</label>
        </div>
        <div class="ui-g-8">
          <input  disabled type="text" pInputText  placeholder="请输入客户名称" [(ngModel)]="infoModify.surname">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label >收费项目：</label>
        </div>
        <div class="ui-g-8"  [ngStyle]="{'line-height':'2vh'}">
          <p-dropdown scrollHeight="100px"  [options]="ChargeSelectOption"  [placeholder]="infoModify.chargeName" (onChange)="chargeSelectChange($event)" [(ngModel)]="infoModify.chargeCode"></p-dropdown>
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="chargeUnit">收费项目单位：</label>
        </div>
        <div class="ui-g-8">
          <input  disabled type="text" pInputText  placeholder="请输入收费项目单位" [(ngModel)]="infoModify.chargeUnit">
        </div>
      </div>

      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="payerName">缴费人姓名：</label>
        </div>
        <div class="ui-g-8">
          <input  type="text" pInputText placeholder="请输入缴费人姓名" [(ngModel)]="infoModify.payerName">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="payerPhone">缴费人手机号：</label>
        </div>
        <div class="ui-g-8">
          <input  type="text" pInputText placeholder="请输入缴费人手机号" [(ngModel)]="infoModify.payerPhone">
        </div>
      </div>
<!--      <div class="ui-g-6">-->
<!--        <div class="ui-g-4">-->
<!--          <label >缴费方式：</label>-->
<!--        </div>-->
<!--        <div class="ui-g-8"  [ngStyle]="{'line-height':'2vh'}">-->
<!--          <p-dropdown scrollHeight="100px"  [options]="paymentMethodOption" [placeholder]="infoModify.paymentMethod"  [(ngModel)]="infoModify.paymentMethod"></p-dropdown>-->
<!--        </div>-->
<!--      </div>-->

      <div class="ui-g-6">
        <div class="ui-g-4">
          <label >开始日期：</label>
        </div>
        <div class="ui-g-8">
          <p-calendar [(ngModel)]="infoModify.startTime" placeholder="请选择开始日期" [monthNavigator]="true" [yearNavigator]="true" dateFormat="yy-mm-dd" yearRange="1900:2100" [locale]="esDate"></p-calendar>
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label >结束日期：</label>
        </div>
        <div class="ui-g-8">
          <p-calendar [(ngModel)]="infoModify.dueTime" placeholder="请选择结束日期" [monthNavigator]="true" [yearNavigator]="true" dateFormat="yy-mm-dd"  yearRange="1900:2100" [locale]="esDate"></p-calendar>
        </div>
      </div>

      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="personLiable">责任人：</label>
        </div>
        <div class="ui-g-8">
          <input type="text" pInputText [placeholder]="infoModify.personLiable" [(ngModel)]="infoModify.personLiable">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="personLiablePhone">责任人电话：</label>
        </div>
        <div class="ui-g-8">
          <input  type="text" pInputText [placeholder]="infoModify.personLiablePhone"  [(ngModel)]="infoModify.personLiablePhone">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="responsibleAgencies">负责机构：</label>
        </div>
        <div class="ui-g-8">
          <input  type="text" pInputText [placeholder]="infoModify.responsibleAgencies" [(ngModel)]="infoModify.responsibleAgencies">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="personLiable">延长日期：</label>
        </div>
        <div class="ui-g-8">
          <input  type="text" pInputText [placeholder]="infoModify.delayTime" [(ngModel)]="infoModify.delayTime">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label >延期原因：</label>
        </div>
        <div class="ui-g-8">
          <textarea  type="text" pInputText [placeholder]="infoModify.delayReason" [(ngModel)]="infoModify.delayReason" [cols]="3" [rows]="4"></textarea>
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
            <label >抵扣金额：</label>
        </div>
        <div class="ui-g-8"  [ngStyle]="{'line-height':'2vh'}">
          <input  type="text" pInputText placeholder="请输入抵扣金额.." [(ngModel)]="infoModify.mortgageAmount">
        </div>
      </div>
      <div class="ui-g-6">
        <div class="ui-g-4">
          <label for="remarks">抵扣原因：</label>
        </div>
        <div class="ui-g-8">
          <textarea id="remark" type="text" pInputText [placeholder]="infoModify.reasonForDeduction" [(ngModel)]="infoModify.reasonForDeduction" [cols]="3" [rows]="4"></textarea>

        </div>
      </div>
    </div>
    </p-scrollPanel>

    <p-footer>
      <div class="ui-dialog-buttonpane ui-helper-clearfix" style=" text-align: center">
        <button class="refund-info-dialog-Btn refund-info-dialog-Btn-sure" (click)="infoModifySureClick()">确认</button>
        <button class="refund-info-dialog-Btn refund-info-dialog-Btn-false"  (click)="infoModifayDialog=false;clearData()">取消</button>
      </div>
    </p-footer>
  </p-dialog>
  <!--详情弹窗-->
  <rbi-detail-pop [dialogOption]="infoDetailOption"></rbi-detail-pop>
  <rbi-paging [option]="option" (pageClick)="nowpageEventHandle($event)"></rbi-paging>
</div>
